import { VFC } from "react";
import style from './base-info.module.less';
import { ProcessBar } from 'zw-components';
import { Pie } from './pie';
export const BaseInfo: VFC = (props) => {
    return (
        <div className={style.baseInfoContainer}>
            <div className={style.computerInfo}>
                <div className={style.itemInfo}>
                    <div className={style.name}>CPU温度</div>
                    <div className={style.bar}>
                        <ProcessBar value={60} total={100} />
                    </div>
                </div>
                <div className={style.itemInfo}>
                    <div className={style.name}>CPU使用率</div>
                    <div className={style.bar}>
                        <ProcessBar value={60} total={100} />
                    </div>
                </div>
                <div className={style.itemInfo}>
                    <div className={style.name}>温度</div>
                    <div className={style.bar}>
                        <ProcessBar value={60} total={100} />
                    </div>
                </div>
            </div>
            <div className={style.computerInfo}>
                <div className={style.diskInfo} style={{ height: '300px', width: '30%' }}>
                    <Pie />
                </div>
                <div className={style.diskInfo} style={{ height: '300px', width: '30%' }}>
                    <Pie />
                </div>
                <div className={style.diskInfo} style={{ height: '300px', width: '30%' }}>
                    <Pie />
                </div>
            </div>
        </div>
    );
}